<template>
<div>
  <div class="history-conn bg-fff">
    <div class="haverecord" v-show="historyList.length">
     <div class="hist-titl f28 color-999 border-bottom px-30">
       <i class="del-icon fr"  @click="clearBrowseHistory"></i>历史选择记录
     </div>
     <div class="hist-list px-30 border-bottom"
      v-for="elem in historyList"
      @click="nextPage(elem)">
       <span class="hist-ico f30 color-333 fl" :class="{'hist-ico-ph': elem.gameType == 2}">
         {{elem.gameName}}{{elem.typeName?'/'+elem.typeName:''}}{{elem.platformName?'/'+elem.platformName:''}}{{elem.areaName?'/'+elem.areaName:''}}{{elem.clientName?'/'+elem.clientName:''}}{{elem.serverName?'/'+elem.serverName:''}}
       </span>
       <i class="ico fr"></i>
     </div>
    </div>
    <div class="norecord" v-show="!historyList.length">
      <div class="nolist-titl f28 color-999 border-bottom">暂无历史记录</div>
    </div>
  </div>
  <div class="maskdivlc" @click="mskClick"></div>
</div>
</template>
<script>
export default {
  data() {
    return {
      historyList: [],
      pathName: this.$route.name
    }
  },
  mounted() {
    if (this.$isLocalStorageSupported()) {
      if(this.pathName==='MGSellHome') {
        this.historyList = localStorage.SellBrowseHistory?JSON.parse(localStorage.SellBrowseHistory):[]
      } else {
        this.historyList = localStorage.BrowseHistory?JSON.parse(localStorage.BrowseHistory):[]
      }
    }
  },
  methods: {
    mskClick() {
      this.$emit('mskClick')
    },
    clearBrowseHistory() {
      if(this.$isLocalStorageSupported()){
        if(this.pathName==='MGSellHome') {
          localStorage.removeItem('SellBrowseHistory')
        } else {
          localStorage.removeItem('BrowseHistory')
        }
        this.historyList = []
      }
    },
    nextPage(item) {
      console.log(item)
      if (this.pathName==='MGSellHome') {
        let query = {
          game_id: item.gameId,
          game_name: item.gameName,
          game_type: item.gameType,
        }
        if (item.platformId) {
          query.platformId = item.platformId
          query.platformName = item.platformName
        }
        if (item.clientId) {
          query.clientId = item.clientId
          query.clientName = item.clientName
        }
        if (item.areaId) {
          query.areaId = item.areaId
          query.areaName = item.areaName
        }
        if (item.serverId) {
          query.serverId = item.serverId
          query.serverName = item.serverName
        }
        if (item.menuIndex||item.menuIndex==0) {
          query.menuIndex = item.menuIndex
        }
        if (item.goodsType) {
          query.goodsType = item.goodsType
          query.goodsTypeName = item.typeName
        }
        if (item.goodsType==3&&item.areaId) {
          if (item.gameType==2) {
            query.chooseOperator = item.platformName
            query.chooseOperatorId = item.platformId
          }
          this.$router.push({
            name:'CreatedGold',
            query: query
          })
        } else {
          if(item.gameType != 2){
            location.href = '/vue/seller/goodsPublish?game_id='+query.game_id+'&game_name='+query.game_name+'&game_type='+query.game_type
            // this.$router.push({
            //   name:'goodsPublish',
            //   query: query
            // })
          }else {
            query.gameId = item.gameId
            query.gameName = item.gameName
            this.$router.push({
              name:'MGSellSetServer',
              query: query
            })
          }
        }

      } else {
        if (item.gameType==2&&(item.goodsType==2 || item.goodsType==3)) {
          //手游账号
          this.$router.push({
            name:'MobileGameList2',
            params: {
              gameId: item.gameId,
              gameName: item.gameName,
              goodsType: item.goodsType
            },
            query: {
              platformId: item.platformId,
              clientId: item.clientId,
              serverId: item.serverId,
              platformName: item.platformName,
              clientName: item.clientName,
              serverName: item.serverName,
            }
          })
        } else if (item.gameType==1) {
          if (item.tradeType==5&&item.serverId&&item.areaId) {
            this.$router.push({
              name:'TradeStone',
              query: {
                gameId: item.gameId,
                gName: item.gameName,
                gameType: item.gameType,
                tradeType: item.tradeType,
                goodsType: item.goodsType,
                typename: item.typeName,
                areaId: item.areaId,
                aName: item.areaName,
                serverId: item.serverId,
                servername: item.serverName,
                areaname: item.areaName,
                serverid: item.serverId,
                areaid: item.areaId,
                gid: item.gameId,
                gname: item.gameName,
              }
            })
          } else {
            switch (item.goodsType) {
              case 1:
                this.$router.push({
                  name:'EquipmentList',
                  params:{
                    gameId: item.gameId,
                    gameName: item.gameName,
                    goodsType:1,
                  },
                  query: {
                    areaId: item.areaId,
                    serverId: item.serverId,
                    serverName: item.serverName,
                  }
                })
                break;
              case 2:
                this.$router.push({
                  name:'PcGoodsList',
                  params:{
                    gameId: item.gameId,
                    gameName: item.gameName,
                    goodsType:2,
                  },
                  query: {
                    areaId: item.areaId,
                    serverId: item.serverId,
                    areaName: item.areaName,
                    serverName: item.serverName,
                  }
                })
                break;
              case 3:
                this.$router.push({
                  name:'ListCoins',
                  query: {
                    gameId: item.gameId,
                    gName: item.gameName,
                    gameType: item.gameType,
                    tradeType: item.tradeType,
                    goodsType: item.goodsType,
                    typename: item.typeName,
                    areaId: item.areaId,
                    aName: item.areaName,
                    serverId: item.serverId,
                    servername: item.serverName,
                    areaname: item.areaName,
                    serverid: item.serverId,
                    areaid: item.areaId,
                    gid: item.gameId,
                    gname: item.gameName,
                  }
                })
                break;
              default:
                if (item.areaId&&item.typeName) {
                  location.href = `/vue/search/searchServer?gameId=${item.gameId}&gName=${item.gameName}&aName=${item.areaName}&areaId=${item.areaId}&gameType=${item.gameType}&goodsType=${item.goodsType}&tradeType=${item.tradeType}&typename=${item.typeName}`
                } else if (item.typeName) {
                  location.href = `/vue/search/searchArea?gameId=${item.gameId}&gName=${item.gameName}&goodsType=${item.goodsType}&gameType=${item.gameType}&tradeType=${item.tradeType}&typename=${item.typeName}`
                } else {
                  this.$router.push({
                      name: "ChooseClass",
                      query: {
                        gid: item.gameId,
                        mainGid: item.mainGid,
                        gname: item.gameName,
                        gameType: item.gameType,
                        type: 'special',
                      },
                  })
                }

            }
          }

        }
      }

    }
  }
}
</script>
<style scoped>
/*历史记录*/
.history-conn{ height:auto; position:fixed; top:0.87rem; width:100%; z-index:88; max-width:768px;}
.history-conn .hist-titl{ height:1rem; line-height:1rem; display:block; overflow:hidden;}
.history-conn .hist-titl i.del-icon{height: 1.1rem; width: .32rem; background:url(~images/del.png) no-repeat right center; background-size:0.3rem;}
.history-conn .hist-list{ height:1rem; line-height:1rem;}
.history-conn .hist-list span.hist-ico{ display:inline-block; height:1rem; background:url(~images/Icon/hist-list-ico.png) no-repeat left center; background-size:0.32rem; padding-left:0.52rem; width:94%;white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.history-conn .hist-list span.hist-ico-ph{ display:inline-block; height:1rem; background:url(~images/Icon/hist-list-ico-iphone.png) no-repeat left center; background-size:0.32rem; padding-left:0.52rem; width:94%;white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.history-conn .hist-list i.ico{ display:inline-block; float:right; background:url(~images/Icon/equright-ico.png) no-repeat right center; width:0.18rem; background-size:0.18rem; height:1rem;}
.nolist-titl{ height:1rem; line-height:1rem; text-align:center;}
.maskdivlc {position:fixed; _position:absolute; left: 0; top: 0; display: block; z-index:30; width: 100%; height: 100%; filter: alpha(opacity=70); opacity: 0.7; background: #000;}
</style>
